// 订单过滤器
import componentBehavior from '../../../../behaviors/component';
import { COMPONENT_OPTIONS } from '../../../../constants/common';
import { getBrandOrderFilter, getStoreOrderFilter, getExpandOrderFilter } from '../../../api/order';
import { ORDER_FILTER_TYPE } from '../../../../constants/order';

Component({
    behaviors: [componentBehavior],
    options: {
        ...COMPONENT_OPTIONS,
    },
    properties: {
        mode: {
            type: String,
            value: 'brand', // brand-品牌侧 store-店铺侧 expand-推广订单
        },
    },
    data: {
        showModal: false,
        active: ORDER_FILTER_TYPE.activity,
        orderFilterType: ORDER_FILTER_TYPE,
        searchValue: '',
        filterList: [],
        selectValue: '',
        selectName: '',
        placeholder: {
            [ORDER_FILTER_TYPE.spokesman]: '搜索代言人',
            [ORDER_FILTER_TYPE.distributor]: '搜索分销员',
            [ORDER_FILTER_TYPE.brand]: '搜索品牌',
            [ORDER_FILTER_TYPE.store]: '搜索店铺',
            [ORDER_FILTER_TYPE.activity]: '搜索活动名',
        },
        typeEnum: {
            [ORDER_FILTER_TYPE.spokesman]: '代言人',
            [ORDER_FILTER_TYPE.distributor]: '分销员',
            [ORDER_FILTER_TYPE.brand]: '品牌',
            [ORDER_FILTER_TYPE.store]: '店铺',
            [ORDER_FILTER_TYPE.activity]: '活动',
        },
    },
    methods: {
        openModal: function () {
            const { mode } = this.data;
            let active;
            if (mode === 'brand') {
                active = ORDER_FILTER_TYPE.distributor;
            } else if (mode === 'store') {
                active = ORDER_FILTER_TYPE.spokesman;
            } else if (mode === 'expand') {
                active = ORDER_FILTER_TYPE.brand;
            };
            this.setData({
                showModal: true,
            });
            setTimeout(() => {
                this.setData({ active });
            }, 300);
        },
        closeModal: function () {
            this.setData({
                showModal: false,
                filterList: [],
            });
        },
        onTypeChange: function (event) {
            this.setData({
                active: event.detail.name,
            });
        },
        searchFilter: async function (event) {
            const value = event.detail;
            this.setData({
                searchValue: value,
            }, async () => {
                await this.getFilterListData();
            });
        },
        getFilterListData: async function () {
            const { mode, searchValue, active } = this.data;
            let filterList = [];
            if (mode === 'brand') {
                // 品牌
                filterList = await getBrandOrderFilter({
                    keyword: searchValue,
                    term: active,
                });
            } else if (mode === 'store') {
                // 店铺
                filterList = await getStoreOrderFilter({
                    keyword: searchValue,
                    term: active,
                });
            } else if (mode === 'expand') {
                // 代言人推广
                filterList = await getExpandOrderFilter({
                    keyword: searchValue,
                    term: active,
                });
            }
            this.setData({
                filterList,
            });
        },
        selectItemAction: function (event) {
            const { value, name } = event.currentTarget.dataset;
            this.setData({
                selectValue: value,
                selectName: name,
            });
        },
        resetSearchValue: function () {
            this.setData({
                searchValue: '',
                selectValue: '',
                selectName: '',
                filterList: [],
            });
        },
        ensureFilter: function () {
            const { active, selectValue, selectName } = this.data;
            this.triggerEvent('filter', {
                type: active,
                value: selectValue,
                name: selectName,
            });
            this.closeModal();
        },
    }
})
